﻿@using IOA.MES.DataAccess.Enum
@{
    ViewBag.Title = "编辑设备";
    Layout = "~/Views/Shared/_LayoutPage.cshtml";
    var workshops = (List<IOA.MES.DataAccess.VModel.VWorkshop>)ViewBag.Workshops;
    var machineTypes = (List<KeyValuePair<MachineType, string>>)ViewBag.MachineTypes;
}
@model IOA.MES.DataAccess.VModel.VMachine

@section Contents{
    <style>
        html {
            background-color: #FFF;
        }

        .layui-form-item .layui-input-inline {
            width: 300px;
        }

        .red {
            color: red;
        }
    </style>
}

<div id="page"></div>

<script type="text/template" id="tplPage">
    <div class="layui-form" lay-filter="layuiadmin-app-form-list" style="padding: 20px 30px;">
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="red">*</span>{{lang.Field.MachineType}}：</label>
            <div class="layui-input-inline">
                <select id="selMachineTypes" lay-filter="selMachineTypes" name="MachineType" @(Model != null ? "disabled" : "")>
                    @foreach (var item in machineTypes)
                    {
                        <option value="@((int)item.Key)" @(Model != null && Model.MachineType == item.Key ? " selected" : "")>@item.Value</option>
                    }
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="red">*</span>{{lang.Field.MachineNo}}：</label>
            <div class="layui-input-inline">
                <input type="text" name="MachineNo" value="@(Model == null ? string.Empty : Model.MachineNo)" placeholder="请输入设备代码" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="red">*</span>{{lang.Field.MachineName}}：</label>
            <div class="layui-input-inline">
                <input type="text" lay-verify="required" name="MachineName" value="@(Model == null ? string.Empty : Model.MachineName)" placeholder="请输入设备名称" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="red">*</span>{{lang.Field.MachineManuf}}：</label>
            <div class="layui-input-inline">
                <input type="text" lay-verify="required" name="Manufacturers" value="@(Model == null ? string.Empty : Model.Manufacturers)" placeholder="请输入设备厂家" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="red">*</span>{{lang.Field.MachineModel}}：</label>
            <div class="layui-input-inline">
                <input type="text" lay-verify="required" name="MachineModel" value="@(Model == null ? string.Empty : Model.MachineModel)" placeholder="请输入设备型号" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">{{lang.Field.IpAddress}}：</label>
            <div class="layui-input-inline">
                <input type="text" name="IpHost" value="@(Model == null ? string.Empty : Model.IpHost)" placeholder="请输入设备IP地址" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="red">*</span>{{lang.Field.WorkShop}}：</label>
            <div class="layui-input-inline">
                <select id="selWorkshops" lay-filter="selWorkshops" name="WorkshopCode">
                    @foreach (var item in workshops)
                    {
                        <option value="@item.WorkshopCode" @(Model != null && string.Equals(Model.WorkshopCode, item.WorkshopCode, StringComparison.CurrentCultureIgnoreCase) ? " selected" : "")>@item.WorkshopName</option>
                    }
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="red">*</span> {{lang.Field.AssemblyLine}}：</label>
            <div class="layui-input-inline">
                <select id="selLines" lay-filter="selLines" name="LineId">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">{{lang.Field.WorkshopSerialNumber}}：</label>
            <div class="layui-input-inline">
                <input type="text" name="MachineIndex" value="@(Model == null || !Model.MachineIndex.HasValue ? string.Empty : Convert.ToString(Model.MachineIndex))" placeholder="请输入在车间内的序号" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="text-align:center;padding-top: 20px;">
            <input type="hidden" name="PkId" value="@(Model==null?0:Model.PkId)" />
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="submit"><i class="layui-icon">&#xe605;</i>{{lang.Field.Submit}}</button>
            @*<button class="layui-btn layui-btn-primary" onclick="parent.layer.close(parent.layer.getFrameIndex(window.name));"><i class="layui-icon">&#xe616;</i>{{lang.Field.Cancel}}</button>*@
        </div>
    </div>
</script>

@section Scripts{
    <script>
        var vm = new Vue({
            el: "#page",
            template: "#tplPage",
            data: {
                lang: JSON.parse(lang).package
            }
        });

        setTimeout(function () {
            initLayui();
        }, 50);
        function initLayui() {
            layui.use(['form', 'layer', 'index', 'laydate'], function () {
                var layer = layui.layer,
                    form = layui.form;

                form.on('select(selWorkshops)', function (data) {
                    queryLines(data.value);
                });

                queryLines("@(Model==null?workshops.FirstOrDefault().WorkshopCode:Model.WorkshopCode)");
                function queryLines(workshopCode) {
                    var loadId = layer.load();
                    $.ajax({
                        url: "/Settings/QueryLines",
                        data: {
                            page: 1,
                            limit: 100,
                            workshopCode: workshopCode,
                            status: null
                        },
                        complete: function () {
                            layer.close(loadId);
                        },
                        success: function (res) {
                            if (res.ErrCode != 200) {
                                layer.msg(res.ErrMsg, { icon: 5 });
                                return;
                            }

                            var lineId = parseInt("@(Model==null?0:Model.LineId)");
                            var options = [""];
                            for (var i = 0; i < res.Data.length; i++) {
                                options.push("<option value=\"" + res.Data[i].PkId + "\"" + (lineId == res.Data[i].PkId ? " selected" : "") + ">" + res.Data[i].LineName + "</option>");
                            }
                            $("#selLines").html(options.join(""));
                            form.render();
                        }
                    });
                }

                form.on('submit(submit)', function (data) {
                    console.log(data.field);
                    if (data.field.MachineIndex.trim() == "") {
                        data.field.MachineIndex = null;
                    }
                    var loadId = layer.load();
                    $.ajax({
                        url: "/Settings/EditMachine",
                        data: {
                            PkId: data.field.PkId,
                            MachineType: data.field.MachineType,
                            MachineNo: data.field.MachineNo,
                            MachineName: data.field.MachineName,
                            Manufacturers: data.field.Manufacturers,
                            MachineModel: data.field.MachineModel,
                            WorkshopCode: data.field.WorkshopCode,
                            IpHost: data.field.IpHost,
                            MachineIndex: data.field.MachineIndex,
                            LineId: data.field.LineId
                        },
                        complete: function () {
                            layer.close(loadId);
                        },
                        success: function (res) {
                            if (res.ErrCode != 200) {
                                layer.msg(res.ErrMsg, { icon: 5 });
                                return;
                            }
                            layer.msg("保存成功！", { icon: 6, time: 1500 }, function () {
                                parent.layer.close(parent.layer.getFrameIndex(window.name));
                            });
                        }
                    });
                    return false;
                });
            });
        }
    </script>
}
